<h1 class="blog_Picture">Listing blogs</h1>

<nav class="navbar navbar-default navbar-static-top" role="navigation">
  <div class="container">
    <ul class="nav navbar-nav">
      <li class="active"><a href="/blogs">Myblog</a></li>
      <li><a href="#">Blogs</a></li>
      <li><a href="#">Photos</a></li>
      <li><a href="#">About</a></li>
    </ul>
  </div>
</nav>

<div class="container page-header text-center">
  <h1>XD's Blog  <small>Happy everyday</small></h1>
</div>

<footer>
  <p class="text-center">
    Copyright © 2014 - Xi Dian
  </p>
</footer>

footer {
  margin-top: 30px;
  padding: 40px 0;
  color: #999;
  text-align: center;
  background-color: #f9f9f9;
  border-top: 1px solid #e5e5e5;
}

<div class="row">
  <div class="col-sm-8 blog-main">
    <% @blogs.reverse.each do |blog| %>
      <div>
        <h2><%= link_to blog.title, blog %></h2>
        <p>
          <%= blog.created_at.strftime("%d %b. %Y") %>
        </p>
        <%= image_tag(blog.picture_url, :class => "image media-object") if blog.picture.present? %>
        <%= simple_format(blog.content) %>
      </div>
    <% end %>
  </div>
  <div class="col-sm-3 col-sm-offset-1">
    <div>
      <%= link_to 'New Blog', new_blog_path, class: 'btn btn-default pull-right' %>
    </div>
  </div>
</div>

body {
  font-family: Georgia, "Times New Roman", Times, serif;
  color: #555;
}

<table>
  <thead>
    <tr>
      <th>Title</th>
      <th>Content</th>
      <th>Picture</th>
      <th></th>
      <th></th>
      <th></th>
    </tr>
  </thead>

  